<template>
	<view class="">
		<view class="good-info">
			<view class="address-con">
				<view class="row" @tap="navTo(`/pages/address/myAddress?id=${address.id}&source=1`)">
					<view class="user-info fill" v-if="address.id">
						<view class="user-adr clamp2">{{address.province}}{{address.city}}{{address.county}}{{address.detail}}</view>
						<view class="" style="padding-top: 20upx;">
							<text class="user-name">{{address.name}}</text>
							<text class="user-name">{{address.phone}}</text>
						</view>
					</view>
					<view class="user-info fill" style="min-height:80upx;line-height:80upx;" v-else>
						请选择收货地址
					</view>
					<view class="column center" style="width:50upx;">
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
				<image src="/static/img/line.png" class="line"></image>
			</view>
			<view class="order-warp">
				<view class="order-info-con" v-for="(item, index) in dataList" :key="index">
					<view class="order-info row between">
						<view class="cart-item-img"><image :src="item.icon" mode="aspectFill" class="img"></image></view>
						<view class="cart-item-right fill">
							<view class="row between">
								<view class="clamp2 cart-item-title">{{item.name}}</view>
							</view>
							<view class="row" style="padding-top: 10upx;">
								<text class="cart-item-num">x 1</text>
							</view>
							<view class="row between item-bottom">
								<text class="cart-item-price">{{item.price}}积分</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="order-info-con " style="padding: 20upx 0;">
				<view class="order-info">支付方式</view>
				<view class="row order-info">
					<u-icon name="/static/img/jb.png" size="30"></u-icon>
					<text class="order-time">积分支付（积分余额{{userInfo.integral}}）</text>
				</view>
			</view>
		</view>
		<view class="footer-btn b-t column center">
			<view class="order-btn one" hover-class="hover-opacity" @tap="subOrder">立即兑换</view>
		</view>
		<!-- <mix-modal ref="mixModal" :text="modalText" :tips="modalTips" :price="modalPrice" title="订单提示" @onConfirm="onModalConfirm"></mix-modal> -->
	</view>
</template>

<script>
export default {
	data() {
		return {
			dataList: [],
			address:{},
			userInfo:{}
		};
	},
	onLoad() {
		this.dataList=getApp().globalData.pointArray;
		this.userInfo=getApp().globalData.userInfo;
		this.getUserAddress();
	},
	methods: {
		 subOrder(){
			if(!this.address.id){
				this.$util.msg('请选择收货地址!');
				return
			}
			this.$util.throttle(async ()=>{
				const data={
					uid: uni.getStorageSync('uid'),
					integralGoodsId:this.dataList[0].id,
					addressId:this.address.id
				}
				const res = await this.$request('integral/pay',data, { showLoading: true });
				if (res.result == 0) {
					uni.redirectTo({
						url:'/pages/point/paysuccess'
					})
				} else {
					this.$util.msg(res.resultNote);
				}
			})
		},
		async getUserAddress() {
			const res = await this.$request('address/list', { uid: uni.getStorageSync('uid') }, { showLoading: true });
			if (res.result == 0) {
				if(res.dataList.length!=0){
					res.dataList.forEach(item=>{
						if(item.isDefault==1){
							this.address=item;
						}
					})
				}
			} else {
				this.$util.msg(res.resultNote);
			}
		},
		setAddress(item){
			item?this.address=item:this.address={};
		}
	}
};
</script>

<style scoped lang="scss">
.footer-btn {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 120upx;
	padding: 0 20upx;
	background: #ffffff;
	z-index: 99;
}
.good-info {
	background: #ffffff;
	border-radius: 20upx 20upx 0 0;
	padding-bottom: 130upx;
}
.address-con {
	padding: 40upx 20upx;
	position: relative;
}
.user-adr {
	font-size: 32upx;
	font-weight: bold;
	color: #000000;
}
.user-name {
	font-size: 24upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #666666;
}
.line {
	position: absolute;
	bottom: 0;
	left: 5upx;
	width: 740upx;
	height: 6upx;
}
.order-warp {
	border-top: 20upx solid rgba(240, 240, 240, 0.3);
}
.item-btn {
	width: 120upx;
	height: 52upx;
	border: 1px solid #c7c7c7;
	border-radius: 26upx;
	text-align: center;
	line-height: 52upx;
	font-size: 26upx;
	color: #666666;
}
.order-info-cell {
	padding: 14upx 20upx;
}
.order-info {
	padding: 20upx;
}
.cart-item-img {
	width: 164upx;
	height: 164upx;
	border-radius: 10upx;
	overflow: hidden;
}
.img {
	width: 164upx;
	height: 164upx;
}
.cart-item-right {
	padding-left: 20upx;
	height: 164upx;
	position: relative;
}
.cart-item-title {
	font-size: 30upx;
	font-family: PingFang SC;
	font-weight: bold;
	color: #000000;
	line-height: 36upx;
}
.cart-item-price {
	font-size: 28upx;
	font-family: PingFang SC;
	font-weight: bold;
	color: #fe2525;
	line-height: 36upx;
}
.price::before {
	content: '￥';
	font-size: 20upx;
}
.cart-item-num {
	font-size: 26upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #666666;
}
.item-bottom {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding-right: 20upx;
}
.order-r-title {
	line-height: 80upx;
	font-size: 26upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #000000;
}
.order-label {
	font-size: 28upx;
	color: #333333;
}
.order-time {
	font-size: 26upx;
	color: #666666;
	margin-left: 10upx;
}
.order-btn {
	width: 706upx;
	height: 88upx;
	text-align: center;
	line-height: 88upx;
	background:#2781A7;
	border-radius: 44upx;
	font-size: 30upx;
	color: #FFFFFF;
}
</style>
